<template>
  <div>
    <!-- ---------------------------查询 部分--------------------------------- -->
    <div>
      
      公司名称:<el-input
        v-model="query.com_name"
        placeholder="请输入行业姓名"
        style="width: 200px"
      ></el-input>


  




      所属行业：
      <el-select v-model="Down.com_ind_id" placeholder="请选择">
        <el-option label="请选择" value=""></el-option>
        <el-option
          v-for="item in indicdown"
          :key="item.com_ind_id"
          :label="item.com_ind_name"
          :value="item.com_ind_id"
        >
        </el-option>
      </el-select>
      公司状态：<el-select v-model="query.com_state" placeholder="选择状态">
        <el-option label="全部" value=""></el-option>
        <el-option label="无效" value="1"></el-option>
        <el-option label="有效" value="2"></el-option>
      </el-select>
      KA:<el-select v-model="Down.com_ka_id" placeholder="请选择">
        <el-option label="请选择" value=""></el-option>
        <el-option
          v-for="item in KAdown"
          :key="item.com_ka_id"
          :label="item.com_ka_name"
          :value="item.com_ka_id"
        >
        </el-option>
      </el-select>
      视频KA<el-select v-model="query.com_mp4" placeholder="选择状态">
        <el-option label="全部" value=""></el-option>
        <el-option label="待定" value="1"></el-option>
        <el-option label="你好" value="2"></el-option>
      </el-select>
      AD tech<el-select v-model="query.com_ad" placeholder="选择状态">
        <el-option label="全部" value=""></el-option>
        <el-option label="否" value="1"></el-option>
        <el-option label="待定" value="2"></el-option>
      </el-select>
      <el-button type="primary">查询</el-button>
      <el-button type="primary" @click="dialogVisible = true">添加</el-button>
    </div>
     <!-- ---------------------------显示 部分--------------------------------- -->
    <div>
      <el-table :data="tableData" style="width: 100%">
        <el-table-column prop="com_name" label="公司名称" width="180">
        </el-table-column>
        <el-table-column prop="com_ind_name" label="所属行业" width="180">
        </el-table-column>
       
         <el-table-column label="公司状态">
        <template slot-scope="scope">
          <el-label v-if="scope.row.com_state"><el-tag>有效</el-tag></el-label>
          <el-label v-else><el-tag>无效</el-tag></el-label>
        </template>
      </el-table-column>
        <el-table-column prop="nat_name" label="公司性质"> </el-table-column>
        <el-table-column prop="com_ka_name" label="KA"> </el-table-column>

        
        <el-table-column label="视频KA">
        <template slot-scope="scope">
          <el-label v-if="scope.row.com_mp4"><el-tag>待定</el-tag></el-label>
          <el-label v-else><el-tag>你好</el-tag></el-label>
        </template>
      </el-table-column>
     
        <el-table-column label="AD tech">
        <template slot-scope="scope">
          <el-label v-if="scope.row.com_ad"><el-tag>是</el-tag></el-label>
          <el-label v-else><el-tag>否</el-tag></el-label>
        </template>
      </el-table-column>
        <el-table-column prop="com_site" label="公司地址"> </el-table-column>
        <el-table-column prop="com_order" label="公司顺序"> </el-table-column>
        <el-table-column fixed="right" label="操作" width="100">
          <template slot-scope="scope">
            <el-button
              @click="EatiCompanyManager(scope.row.com_id)"
              type="text"
              size="small"
              >编辑</el-button
            >
            <el-button
              @click="DeletCompanyManager(scope.row.com_id)"
              type="text"
              size="small"
              >删除</el-button
            >
          </template>
        </el-table-column>
      </el-table>
    </div>
    <!-- ---------------------------分页 部分--------------------------------- -->
    <div>
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="pageindex"
        :page-sizes="[3, 4, 5, 6]"
        :page-size="pagesize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="totalcount"
      >
      </el-pagination>
    </div>
    <!-- ----------------添加 部分--------------- -->
    <div>
      <el-dialog title="添加" width="30%" :visible.sync="dialogVisible">
        <el-form ref="form" :model="form" label-width="80px">
          <el-form-item label="名称">
            <el-input v-model="form.com_name"></el-input>
          </el-form-item>
          <el-form-item label="所属行业">
            <el-select v-model="form.com_ind_id" placeholder="请选择">
              <el-option label="请选择" value=""></el-option>
              <el-option
                v-for="item in indicdown"
                :key="item.com_ind_id"
                :label="item.com_ind_name"
                :value="item.com_ind_id"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="公司性质">
            <el-select v-model="form.nat_id" placeholder="请选择">
              <el-option label="请选择" value="0"></el-option>
              <el-option
                v-for="item in nat_iddown"
                :key="item.nat_id"
                :label="item.nat_name"
                :value="item.nat_id"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="KA">
            <el-select v-model="form.com_ka_id" placeholder="请选择">
              <el-option label="请选择" value=""></el-option>
              <el-option
                v-for="item in KAdown"
                :key="item.com_ka_id"
                :label="item.com_ka_name"
                :value="item.com_ka_id"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="视频KA">
            <el-select v-model="form.com_mp4" placeholder="选择状态">
              
              <el-option label="待定" value="0"></el-option>
              <el-option label="你好" value="1"></el-option>
            </el-select>
          </el-form-item>


          <el-form-item label="AD tech">
            <el-select v-model="form.com_ad" placeholder="选择状态">
       
              <el-option label="否" value="0"></el-option>
              <el-option label="待定" value="1"></el-option>
            </el-select>
          </el-form-item>
            <el-form-item label="公司地址">
            <el-input v-model="form.com_site"></el-input>
          </el-form-item>
            <el-form-item label="公司顺序">
            <el-input v-model="form.com_order"></el-input>
          </el-form-item>
          <el-form-item label="状态">
            <el-select v-model="form.com_state" placeholder="选择状态">
          
              <el-option label="有效" value="0"></el-option>
              <el-option label="无效" value="1"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="CompanyManagerAdd"
              >添加</el-button
            >
            <el-button @click="dialogVisible = false">取 消</el-button>
          </el-form-item>
        </el-form>
      </el-dialog>
    </div>
    <!-- ----------------修改 部分--------------- -->
    <div>
      <el-dialog title="修改" width="30%" :visible.sync="Updateisible">
        <el-form ref="form2" :model="form2" label-width="80px">
          <el-form-item label="名称">
            <el-input v-model="form2.com_name"></el-input>
          </el-form-item>
          <el-form-item label="所属行业">
            <el-select v-model="form2.com_ind_id" placeholder="请选择">
              <el-option label="请选择" value=""></el-option>
              <el-option
                v-for="item in indicdown"
                :key="item.com_ind_id"
                :label="item.com_ind_name"
                :value="item.com_ind_id"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="公司性质">
            <el-select v-model="form2.nat_id" placeholder="请选择">
              <el-option label="请选择" value="0"></el-option>
              <el-option
                v-for="item in nat_iddown"
                :key="item.nat_id"
                :label="item.nat_name"
                :value="item.nat_id"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="KA">
            <el-select v-model="form2.com_ka_id" placeholder="请选择">
              <el-option label="请选择" value=""></el-option>
              <el-option
                v-for="item in KAdown"
                :key="item.com_ka_id"
                :label="item.com_ka_name"
                :value="item.com_ka_id"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="视频KA">
            <el-select v-model="form2.com_mp4" placeholder="选择状态">
             
              <el-option label="待定" :value="0"></el-option>
              <el-option label="你好" :value="1"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="AD tech">
            <el-select v-model="form2.com_ad" placeholder="选择状态">
             
              <el-option label="否" :value="0"></el-option>
              <el-option label="待定" :value="1"></el-option>
            </el-select>
          </el-form-item>
            <el-form-item label="公司地址">
            <el-input v-model="form2.com_site"></el-input>
          </el-form-item>
            <el-form-item label="公司顺序">
            <el-input v-model="form2.com_order"></el-input>
          </el-form-item>
          <el-form-item label="状态">
            <el-select v-model="form2.com_state" placeholder="选择状态">
       
              <el-option label="有效" :value="0"></el-option>
              <el-option label="无效" :value="1"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="CompanyManagerUpdate"
              >修改</el-button
            >
            <el-button @click="Updateisible = false">取 消</el-button>
          </el-form-item>
        </el-form>
      </el-dialog>
    </div>
  </div>
</template>
 
<script>
export default {
  data() {
    return {
      customerInfo: {
        hang:null,
        intimacy:null
      },
      //添加弹框
      dialogVisible: false,
      //修改ta、
      Updateisible: false,
      //添加
      form: {
        com_name: "",
        com_ind_id: "",
        com_state: "",
        nat_id: "",
        com_ka_id: "",
        com_mp4: "",
        com_ad: "",
        com_site: "",
        com_order: "",
      },
      //反填属性
      form2:[],
      //公司性质下拉
      nat_iddown: [],
      tableData: [],

      //查询条件
      query: {
        com_name: null,
        com_state: null,
        com_mp4: null,
        com_ad: null,
      },

      pageindex: 1,
      pagesize: 3,
      totalcount: 0,

      //行业下拉
      indicdown: [],
      //KA下拉
      KAdown: [],

      //下拉对象
      Down: {
        //行业
        com_ind_id: "",
        //KA
        com_ka_id: "",
      },
      //添加弹框
      dialogVisible: false,
    };
  },
  created() {
    this.IndustryAdmin();
    this.KA();
    this.CompanyManagerShow();
    this.NatModelDown();
    this.components();
  },
  methods: {
    components: {
    dictionaryTableSelect: () =>
      import("@/components/layout/system_manager/DictionaryTableSelect"),
  },
    //删除
    DeletCompanyManager(id){
        if (confirm("确定删除吗？")) {
        this.$axios.delete(`http://localhost:38204/api/CompanyAdmin/Delete_CompanyAdminModel?com_id=${id}`).then((r) => {
          if (r.status == 200) {
            alert("删除成功");

            this.CompanyManagerShow();
          } else {
            alert("删除失败");
          }
        });
      }
    },
    //修改
CompanyManagerUpdate(){
  this.$axios.put(`http://localhost:38204/api/CompanyAdmin/Update_CompanyAdminModel`,this.form2).then(r=>{
            if(r.status==200)
            {
                alert("修改成功");
                this.Updateisible= false,
                this.CompanyManagerShow();

            }
            else{
                alert("添加失败");
            }
        })
},
    //反填
    EatiCompanyManager(id){
      this.Updateisible=true;
      this.$axios.get(`http://localhost:38204/api/CompanyAdmin/Eait_Delete_CompanyAdminModel?com_id=${id}`).then(r=>{
        this.form2=r.data.data;
      })

    },
    //添加
    CompanyManagerAdd() {
        this.$axios.post(`http://localhost:38204/api/CompanyAdmin/Add_CompanyAdminModel`,this.form).then(r=>{
            if(r.status==200)
            {
                alert("添加成功");
                this.dialogVisible= false,
                this.CompanyManagerShow();

            }
            else{
                alert("添加失败");
            }
        })
    },
    //公司性质下拉
    NatModelDown() {
      this.$axios
        .get(`http://localhost:38204/api/CompanyAdmin/Down_NatModel`)
        .then((r) => {
          this.nat_iddown = r.data.data;
        });
    },
    //显示
    CompanyManagerShow() {
      this.$axios
        .get(`http://localhost:38204/api/CompanyAdmin/Show_CompanyAdminModel`, {
          params: {
            pageindex: this.pageindex,
            pagesize: this.pagesize,
            com_ind_id: this.Down.com_ind_id,
            com_state: this.query.com_state,
            com_ka_id: this.Down.com_ka_id,
            com_mp4: this.query.com_mp4,
            com_ad: this.query.com_ad,
            com_name: this.query.com_name,
          },
        })
        .then((r) => {
          this.tableData = r.data.list;
          this.totalcount = r.data.totalcount;
        });
    },
    //行业下拉
    IndustryAdmin() {
      this.$axios
        .get(`http://localhost:38204/api/CompanyAdmin/Down_IndustryAdminModel`)
        .then((r) => {
          this.indicdown = r.data.data;
        });
    },
    KA() {
      this.$axios
        .get(`http://localhost:38204/api/CompanyAdmin/Down_KaModel`)
        .then((r) => {
          this.KAdown = r.data.data;
        });
    },                  
    handleSizeChange(val) {
      this.pagesize = val;
      this.CompanyManagerShow();
      console.log(`每页 ${val} 条`);
    },
    handleCurrentChange(val) {
      this.pageindex = val;
      this.CompanyManagerShow();
      console.log(`当前页: ${val}`);
    },
  },
};
</script>

<style>
</style>